<!--
 * @Author: 冯向博
 * @Date: 2021-10-19 16:40:29
 * @LastEditTime: 2021-10-29 13:35:27
-->
<template>
	<view>
		<!-- <u-navbar :is-back="false" title="　" :border-bottom="false">
			<view class="u-flex u-row-right" style="width: 100%;">
				<view class="camera u-flex u-row-center">
					<u-icon
						name="camera-fill"
						color="#000000"
						size="48"
					></u-icon>
				</view>
			</view>
		</u-navbar> -->
		<view class="u-flex user-box u-p-t-30 u-p-l-30 u-p-r-20 u-p-b-30">
			<view class="u-m-r-10 avatar-body">
				<view>
					<oss-upload></oss-upload>
				</view>
			</view>
			<view class="u-flex-1">
				<view class="u-font-18 u-p-b-20">{{ vuex_user.name }}</view>
				<view class="u-font-14 u-tips-color"
					>邮箱:{{ vuex_user.email }}</view
				>
			</view>
		</view>

		<view class="u-m-t-20">
			<u-cell-group>
				<u-cell-item
					icon="setting"
					title="个人信息"
					@click="toBaseInfo"
				></u-cell-item>
			</u-cell-group>
		</view>

		<view class="u-m-t-20">
			<u-cell-group>
				<u-cell-item icon="rmb-circle" title="所有订单"></u-cell-item>
				<u-cell-item icon="star" title="商品收藏"></u-cell-item>
				<u-cell-item icon="map" title="地址管理"></u-cell-item>
			</u-cell-group>
		</view>

		<view class="u-m-t-20">
			<u-cell-group>
				<u-cell-item
					icon="reload"
					title="退出登录"
					@click="logout"
				></u-cell-item>
			</u-cell-group>
		</view>
	</view>
</template>

<script>
import ossUpload from "../../components/oss-upload/oss-upload.vue";
export default {
	components: { ossUpload },
	data() {
		return {};
	},
	onLoad() {
		if (!this.$u.utils.isLogin()) return;
	},
	methods: {
		toBaseInfo() {
			this.$u.route({
				url: "pages/center/baseInfo",
			});
		},
		async logout() {
			console.log("logout");
			// 请求 api
			await this.$u.api.authLogout();

			this.$u.toast("退出成功");

			setTimeout(() => {
				// 清除缓存
				this.$u.vuex("vuex_token", null);
				this.$u.vuex("vuex_user", {});

				this.$u.route({
					type: "reLaunch",
					url: "pages/index/index",
				});
			}, 1500);
		},
	},
};
</script>

<style lang="scss">
page {
	background-color: #ededed;
}

.camera {
	width: 54px;
	height: 44px;

	&:active {
		background-color: #ededed;
	}
}
.user-box {
	background-color: #fff;
}
.avatar-body {
	width: 70px;
	height: 70px;
}
</style>
